<template>
  <div class="createPost-container">
    <el-divider
      style=""
    ><span
      style="color: #666; font-size: 12px"
    >以下为当前项目审核记录</span></el-divider>
    <div class="createPost-main-container-sign-audit">
      <el-timeline>
        <el-timeline-item
          v-for="(item, index) in statusList"
          :key="index"
          :timestamp="item.created_at"
          placement="top"
        >
          <el-card>
            <h4>{{ item.audti_reason }}</h4>
            <span
              v-if="item.audit_status == '签约审核通过'"
              style="color: #13ce66"
            >
              签约审核通过
            </span>
            <span
              v-else-if="item.audit_status == '签约审核不通过'"
              style="color: red"
            >
              签约审核不通过
            </span>
            <span
              v-else-if="item.audit_status == '通过'"
              style="color: #13ce66"
            ><span v-if="item.identity == '科员'">初审通过</span>
              <span v-if="item.identity == '科长'">复审通过</span></span>

            <span
              v-else
              style="color: red"
            ><span v-if="item.identity == '科员'">初审不通过</span>
              <span v-if="item.identity == '科长'">复审不通过</span></span>
            <p>{{ item.user_name }} 提交于 {{ item.created_at }}</p>
          </el-card>
        </el-timeline-item>
      </el-timeline>
    </div>
    <el-form
      :model="auditFrom"
      label-width="80px"
      label-position="right"
      style="padding-top: 10px"
    >
      <div class="createPost-main-container-audit">
        <el-form-item label="审核状态 *" label-width="125px">
          <el-select v-model="auditFrom.status" placeholder="请选择">
            <el-option
              v-for="item in passList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>

        <el-form-item
          label="审核意见 *"
          label-width="125px"
          style="margin-top: 20px"
          class="label_per"
        >
          <el-input v-model="auditFrom.text" type="tareare" />
        </el-form-item>
      </div>
    </el-form>
    <div style="text-align: center; padding: 20px">
      <el-button type="success" @click="submitAudit">审核</el-button>
      <el-button type="default" @click="back">返回</el-button>
    </div>
  </div>
</template>

<script>
import { getToken } from '@/utils/auth'
import { getInfo } from '@/api/user'
import { clerkAudit, selectStatus, signAudit } from '@/api/project'

const defaultForm = {
  status: 'draft',
  // projectArea: { province: "广东省", city: "广州市", area: "海珠区" }, //项目区域
  address_detailed: '', // 详细地址
  projectAreaStr: '', // 选择的地区字符串
  bid_open_time: '', // 开标时间
  project_name: '', // 项目名称
  qualifications: '', // 资格条件
  researchers: '', // 人员要求
  constructionUnit: '', // 建设单位
  agentUnit: '', // 代理单位
  projectOverview: '', // 项目概况
  scores: '', // 分值组成
  business_standard: '', // 商务标评分情况
  credit_points: '' // 资信分情况
}
// http://dc.tuobao.m.com/storage/images
export default {
  name: 'Audit',
  props: {
    is_sign_audit: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      postForm: Object.assign({}, defaultForm),
      projectListId: '', // 当前项目id
      diaplayAudit: true,
      username: '', // 当前登录用户姓名
      is_auditShow: '', // 科员审核按钮
      is_auditShowTwo: '', // 科长审核按钮
      auditLevel: [], // 审核权限数组 当有科员和科长权限时进行判断
      auditStatus: '', // 判断当前项目是科员审核还是科长审核
      value: '',
      auditFrom: {
        status: '',
        text: '',
        clerkText: ''
      }, // 审核表单内容
      statusList: [], // 项目审核记录列表
      passList: [
        {
          value: '1',
          label: '通过'
        },
        {
          value: '2',
          label: '不通过'
        }
      ],
      options: [
        {
          value: '监理',
          label: '监理'
        },
        {
          value: '造价咨询',
          label: '造价咨询'
        },
        {
          value: '代理',
          label: '代理'
        },
        {
          value: '全过程咨询',
          label: '全过程咨询'
        }
      ]
    }
  },
  computed: {},
  created() {
    if (this.is_sign_audit) {
      const id = this.$route.query && this.$route.query.id
      const value = this.$route.query.value
      const status = this.$route.query && this.$route.query.status
      this.projectListId = id
      this.auditStatus = status
      this.value = value
      if (value == 1) {
        this.diaplayAudit = false
      } else if (value == 2) {
        this.diaplayAudit = true
      } else {
        this.diaplayAudit = false
      }
      this.getUserInfo()
    }
    this.selectAuditStatus()
  },
  methods: {
    // 返回
    back() {
      this.$router.go(-1)
    },
    // 查询审核记录
    selectAuditStatus() {
      new Promise((resolve, reject) => {
        selectStatus({ id: this.projectListId }).then((response) => {
          this.statusList = response.data
          // console.log(this.statusList);
        })
      })
    },
    // 清除表单和关闭dialog对话框
    clearFrom() {
      this.auditFrom.status = '' // 清空表单
      this.auditFrom.clerkText = '' // 清空表单
      this.is_opinion = false // 将科员意见input 隐藏
    },
    // 提交审核
    submitAudit() {
      return new Promise((resolve, reject) => {
        signAudit({
          auditFrom: this.auditFrom,
          id: this.projectListId
        }).then((response) => {
          this.$message({
            type: 'success',
            message: '审核成功!'
          })
          this.$router.go(-1)
        })
      })
    },

    // 获取当前用户的登录信息
    getUserInfo() {
      new Promise((resolve, reject) => {
        getInfo().then((response) => {
          this.username = response.data.name // 当前登录用户的姓名
          const userPermissions = response.data.per
          for (let i = 0; i < userPermissions.length; i++) {
            // 科员审核
            if (userPermissions[i] == 'clerk audit') {
              this.auditLevel.push(userPermissions[i])
            }
            // 科长审核
            if (userPermissions[i] == 'section audit') {
              this.auditLevel.push(userPermissions[i])
            }
          }
        })
      })
    }
  }
}
</script>

<style>
.createPost-main-container-sign-audit {
  padding: 0px 55px 0px 60px;
}
.createPost-main-container-sign-audit
  .el-timeline-item__content
  .el-card__body {
  padding: 0px;
  padding-left: 20px;
}
.el-timeline .el-timeline-item {
  padding-bottom: 5px;
}
.el-divider--horizontal {
  margin: 12px 0px;
}
</style>
